<template>
  <div class="Setasider-container">
   <avatar url="https://tse4-mm.cn.bing.net/th/id/OIP-C.xEEgBVce-oqtFaQhbTMq6QHaNK?w=115&h=201&c=7&r=0&o=5&dpr=1.3&pid=1.7" :size="150"/>
   <h1 class="title">你爹的窝</h1>
   <me></me>
   <contact/>
   <p class="ip">黑IP12365478</p>
  </div>
</template>

<script>
import avatar from '../Avatar/index.vue';
import me  from '../Menu/index.vue';
import contact from '../Contact/index.vue';
export default {
    components:{
        avatar,
        me,
        contact,
    }
}
</script>

<style lang="less" scoped>
@import '~@/style/global.less';
@import '~@/style/var.less';
body{
    margin: 0;
}
 .Setasider-container{
    width: 100%;
    height: 100%;
    background: @dark;
    padding-top: 10px;
    overflow-x: hidden;
    overflow-y: auto;
    .Avatar-container{
        margin: 0 auto;
    }
    .Menu-container{
        margin: 20px 0;
    }
    .Contact-container{
        margin: 100px 0;
    }
    .title{
        color: #fff;
        font-size: 14px;
        text-align: center;
        height: 20px;
        line-height: 20px;
        margin-top: 10px;
    }
    .ip{
        text-align: center;
    }
 }
</style>